<template>
  <div class="dmform-listeditor">
    <a-tag v-for="(item, index) in newArray" :key="index" color="blue" :visible="true" :closable="true" @close="doRemove(index)">
      {{ item.itemName }} ({{ item.itemValue }})
    </a-tag>
    <a-tag style="borderStyle: dashed; cursor: pointer; padding: 0 5px;" @click="doAddPrepare">
      <a-icon type="plus" />
    </a-tag>
    <a-modal v-model="editable" :width="350" :closable="true" title="添加字典项" :footer="null">
      <AddItem :visible="editable" @onConfirm="doAddConfirm" @onCancel="doAddCancel" />
    </a-modal>
  </div>
</template>
<script>
import AddItem from './AddItem.vue'
import ListDataEditorJS from "@/components/ListData/ListDataEditor.js";

export default {
  components: { AddItem },
  mixins: [ListDataEditorJS]
}
</script>
